.pub_mine_index {
    min-height: 100vh;
    padding: calc(var(--status-bar-height) + 100rpx) 0 0 0;
    background-image: linear-gradient(to right, #D31318, #F06956);

    .pub_header {
        background-image: linear-gradient(to right, #D31318, #F06956);
    }

    .page_box {

        .user_div {
            width: calc(100% - 60rpx);
            margin: 0 auto;
            display: flex;
            align-items: center;
            padding: 40rpx 0 40rpx 40rpx;

            .headimg {
                width: 120rpx;
                height: 120rpx;
                border-radius: 50%;
                overflow: hidden;
                border: 4rpx solid #fff;
                background: #fff;
            }

            .text {
                width: calc(100% - 220rpx);
                padding: 0 0 0 30rpx;

                .name {
                    height: 54rpx;
                    display: flex;
                    align-items: center;

                    .span {
                        line-height: 40rpx;
                        color: #fff;
                        font-size: 32rpx;
                        font-weight: bold;
                        margin: 0 20rpx 0 0;
                    }

                    .span_1 {
                        height: 40rpx;
                        background: url("@/static/aimg/img_20.png") center no-repeat, url("@/static/aimg/img_17.png") left 10rpx center no-repeat;
                        background-size: 100% 100%, 26rpx auto;
                        padding: 0 20rpx 0 50rpx;
                        line-height: 38rpx;
                        font-size: 20rpx;
                        color: #FFFFFF;
                        margin: 0 20rpx 0 0;
                    }

                    .span_2 {
                        height: 40rpx;
                        background: url("@/static/aimg/img_20.png") center no-repeat, ;
                        background-size: 100% 100%;
                        padding: 0 20rpx 0 20rpx;
                        line-height: 38rpx;
                        font-size: 20rpx;
                        color: #FFFFFF;
                    }
                }

                .id {
                    line-height: 40rpx;
                    color: #fff;
                    font-size: 24rpx;
                    margin-top: 10rpx;

                    .span {
                        margin: 0 0 0 20rpx;
                        font-size: 20rpx;
                        color: #FBBE41;
                    }
                }
            }
        }

        .nums_div {
            width: calc(100% - 60rpx);
            margin: 0 auto;
            background-color: #fff;
            border-radius: 30rpx;
            padding: 30rpx;

            .title {
                line-height: 40rpx;
                color: #010101;
                font-size: 26rpx;
                font-weight: bold;
                padding: 0 0 0 40rpx;
                position: relative;
                background: url("@/static/aimg/img_18.png") left center no-repeat;
                background-size: 24rpx auto;

                .more {
                    font-size: 20rpx;
                    color: #1E1E1E;
                    float: right;
                    font-weight: normal;
                }
            }

            .num {
                display: flex;

                .li {
                    width: 33.33333%;
                    background-color: #FFFFFF;
                    border-radius: 8rpx;
                    padding: 40rpx 0 20rpx 0;
                    position: relative;

                    .p_1 {
                        line-height: 60rpx;
                        font-size: 42rpx;
                        color: #000;
                        font-weight: bold;
                        text-align: center;
                    }

                    .p_2 {
                        line-height: 30rpx;
                        font-size: 24rpx;
                        color: #000;
                        text-align: center;
                    }

                    .p_3 {
                        width: 50rpx;
                        height: 26rpx;
                        border: 2rpx solid #000000;
                        line-height: 22rpx;
                        text-align: center;
                        font-size: 16rpx;
                        position: absolute;
                        top: 10rpx;
                        right: 10rpx;
                        border-radius: 6rpx;
                    }
                }

                .li::before {
                    width: 2rpx;
                    height: 120rpx;
                    background-color: #DBDBDB;
                    position: absolute;
                    right: 0;
                    top: 50%;
                    margin-top: -60rpx;
                    content: "";
                }

                .li:last-child::before {
                    background-color: #fff;
                }
            }
        }

        .tools_div {
            width: 100%;
            margin-top: 40rpx;
            background-color: #fff;
            border-top-left-radius: 30rpx;
            border-top-right-radius: 30rpx;
            padding: 30rpx 30rpx 20vh 30rpx;

            .title {
                line-height: 60rpx;
                color: #000000;
                font-size: 32rpx;
                font-weight: bold;
                padding: 0 0 0 30rpx;
                position: relative;
            }

            .title::before {
                width: 9rpx;
                height: 32rpx;
                position: absolute;
                top: 50%;
                margin-top: -16rpx;
                left: 0;
                content: "";
                background-color: #FF2E2E;
                border-radius: 10rpx;
            }

            .lis {
                display: flex;
                flex-wrap: wrap;

                .li {
                    width: 25%;

                    .img {
                        width: 50rpx;
                        height: 50rpx;
                        margin: 60rpx auto 12rpx auto;
                    }

                    .txt {
                        line-height: 40rpx;
                        color: #343434;
                        font-size: 26rpx;
                        text-align: center;
                    }
                }
            }

        }

        .img_div {
            width: calc(100% - 60rpx);
            margin: -20rpx auto 0 auto;
        }
    }
}

.pub_mine_info {
    height: 100vh;
    background-color: #F8F8F8;

    .page_box {
        padding: 30rpx 30rpx 0 30rpx;

        .info_div {
            background-color: #fff;
            border-radius: 20rpx;
            padding: 60rpx 40rpx;

            .pub_inputs {
                .ali {
                    background-color: #F8F8F8;
                }
            }
        }

        .headimg {
            width: 200rpx;
            margin: 0 auto;

            .img {
                width: 200rpx;
                height: 200rpx;
                border-radius: 50%;
                background-size: cover;
                background-repeat: no-repeat;
                background-position: center;
                overflow: hidden;
                // border: 4rpx solid rgba(0, 107, 85, 0.8);
            }

            .p {
                line-height: 40rpx;
                text-align: center;
                font-size: 28rpx;
                color: #0F0F0F;
                margin-top: 20rpx;
            }
        }
    }
}

.pub_team {
    background-color: #f8f8f8;
    min-height: 100vh;

    .page_box {

        .info_div {
            width: calc(100% - 60rpx);
            margin: 30rpx auto;
            background-color: #fff;
            border-radius: 30rpx;
            padding: 30rpx;
            box-shadow: 0 0 10rpx 0 rgba(4, 0, 0, 0.1);

            .li_1 {
                line-height: 60rpx;
                color: #000000;
                font-size: 30rpx;

                .num {
                    color: #F8211D;
                    font-weight: bold;
                    font-size: 36rpx;
                }
            }

            .li_2 {
                margin-top: 20rpx;
                border-top: 2rpx solid #EAE6E6;
                display: flex;
                flex-wrap: wrap;

                .num {
                    width: 33.333%;
                    padding: 30rpx 0 0 0;

                    .p_1 {
                        line-height: 40rpx;
                        color: #6D6D6D;
                        font-size: 24rpx;
                        text-align: center;
                    }

                    .p_2 {
                        line-height: 50rpx;
                        color: #000000;
                        font-size: 36rpx;
                        text-align: center;
                        font-weight: bold;
                    }
                }
            }
        }

        .team_div {
            width: calc(100% - 60rpx);
            margin: 0 auto;
            background-color: #fff;
            border-radius: 30rpx;
            padding: 30rpx;
            box-shadow: 0 0 10rpx 0 rgba(4, 0, 0, 0.1);

            .lis_div {
                .title {
                    line-height: 60rpx;
                    color: #000000;
                    font-size: 32rpx;
                    font-weight: bold;
                    padding: 0 0 0 30rpx;
                    position: relative;
                    margin-bottom: 30rpx;
                }

                .title::before {
                    width: 9rpx;
                    height: 32rpx;
                    position: absolute;
                    top: 50%;
                    margin-top: -16rpx;
                    left: 0;
                    content: "";
                    background-color: #FF2E2E;
                    border-radius: 10rpx;
                }

                .li {
                    width: 100%;
                    display: flex;
                    align-items: center;
                    margin-top: 20rpx;

                    .headimg {
                        width: 90rpx;
                        height: 90rpx;
                        border-radius: 50%;
                        overflow: hidden;
                    }

                    .span {
                        width: calc(100% - 290rpx);
                        display: flex;
                        align-items: center;
                        height: 40rpx;
                        padding: 0 0 0 30rpx;

                        .span_0 {
                            height: 40rpx;
                            line-height: 40rpx;
                            color: #000000;
                            font-size: 30rpx;
                            max-width: 60%;
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                        }

                        .span_1 {
                            height: 30rpx;
                            border-radius: 15rpx;
                            line-height: 30rpx;
                            color: #966300;
                            font-size: 16rpx;
                            background-color: #FABA56;
                            padding: 0 10rpx;
                            margin: 0 0 0 20rpx;
                        }
                    }

                    .txt {
                        width: 200rpx;
                        height: 40rpx;
                        line-height: 40rpx;
                        color: #000;
                        font-size: 30rpx;
                        text-align: right;
                    }
                }
            }
        }
    }
}

.pub_realname {
    height: 100vh;
    background-color: #f8f8f8;

    .page_box {
        padding: 30rpx;
    }
}

.pub_mine_service {
    background-color: #f8f8f8;

    .page_box {

        .info_div {
            width: calc(100% - 60rpx);
            margin: 30rpx auto;
            background-color: #fff;
            border-radius: 30rpx;
            padding: 30rpx;
            box-shadow: 0 0 10rpx 0 rgba(4, 0, 0, 0.1);
            position: relative;

            .li_1 {
                line-height: 60rpx;
                color: #000000;
                font-size: 30rpx;

                .num {
                    color: #F8211D;
                    font-weight: bold;
                    font-size: 36rpx;
                }

                .span {
                    font-weight: bold;
                    font-size: 36rpx;
                }
            }

            .btn {
                position: absolute;
                right: 30rpx;
                bottom: 40rpx;
                width: 150rpx;
                height: 60rpx;
                line-height: 60rpx;
                font-size: 30rpx;
            }
        }

        .service_div {
            width: calc(100% - 60rpx);
            margin: 0 auto;
            background-color: #fff;
            border-radius: 30rpx;
            padding: 30rpx 0;
            box-shadow: 0 0 10rpx 0 rgba(4, 0, 0, 0.1);

            .tab_box {
                display: flex;
                justify-content: space-around;

                .tab {
                    line-height: 80rpx;
                    color: #000000;
                    font-size: 36rpx;
                    position: relative;
                }

                .tab_active {
                    font-weight: bold;
                }

                .tab_active::before {
                    width: 60rpx;
                    height: 8rpx;
                    background-color: #F8211D;
                    position: absolute;
                    bottom: 0;
                    left: 50%;
                    margin-left: -30rpx;
                    border-radius: 4rpx;
                    content: "";
                }
            }

            .search_box {
                width: calc(100% - 60rpx);
                margin: 30rpx auto;

                ::v-deep .btn_text {
                    width: 180rpx;
                    background-color: #F8211D;
                    color: #fff;
                    border-radius: 30rpx;
                    font-size: 24rpx;
                }

                ::v-deep .input {
                    background-color: #F4F4F4;
                    margin: 0 30rpx 0 0;
                    border-radius: 30rpx;
                }
            }

            .lis_box {
                min-height: 400rpx;

                .th {
                    background-color: #F5F5F5;
                    padding: 10rpx 30rpx;

                    .td {
                        font-size: 24rpx !important;
                    }
                }

                .tr {
                    padding: 30rpx 30rpx 0 30rpx;

                    .td {
                        font-size: 24rpx !important;
                    }
                }

                .th,
                .tr {
                    display: flex;
                    align-items: center;

                    .td {
                        line-height: 40rpx;
                        color: #000000;
                        font-size: 28rpx;
                    }

                    .td_1 {
                        width: 60rpx;
                        text-align: center;
                        margin: 0 40rpx 0 0;

                        .img {
                            width: 60rpx;
                            height: 60rpx;
                            border-radius: 50%;
                            overflow: hidden;
                        }
                    }

                    .td_2 {
                        width: calc(100% - 100rpx - 200rpx - 80rpx);
                        display: flex;
                        align-items: center;

                        .name {
                            height: 40rpx;
                            line-height: 40rpx;
                            font-size: 20rpx;
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            max-width: 50%;
                        }

                        .grade {
                            height: 30rpx;
                            line-height: 30rpx;
                            font-size: 20rpx;
                            color: #fff;
                            background-color: #F8211D;
                            opacity: 0.5;
                            border-radius: 10rpx;
                            padding: 0 8rpx;
                            margin: 0 0 0 10rpx;
                        }
                    }

                    .td_3 {
                        width: 200rpx;
                    }

                    .td_4 {
                        width: 80rpx;
                        text-align: center;
                    }
                }

                .tr {

                    .td_4 {
                        color: #F8211D;
                    }
                }
            }
        }
    }
}


.pub_invite {
    background-color: #F13F2F;

    .page_box {
        position: relative;

        .bg_img {
            width: 100vw;
            height: auto;
        }

        .img_box {
            width: 46vw;
            height: 46vw;
            position: absolute;
            left: 50%;
            top: 77vw;
            margin-left: -23vw;


            .qrcode_img {
                width: 100%;
                height: 100%;
                margin: 0 auto;
            }
        }

        .text {
            position: absolute;
            top: 65vw;
            left: 0;
            width: 100%;
            color: #333;
            font-size: 26rpx;
            text-align: center;
            line-height: 40rpx;
            font-weight: bold;
        }

        .btn {
            position: absolute;
            top: 155vw;
            left: 10vw;
            width: 80vw;
            line-height: 110rpx;
            text-align: center;
            color: #000;
            font-size: 36rpx;
            box-sizing: border-box;
            background-color: #fff;
            ;
            border-radius: 55rpx;
        }
    }
}

.pub_mine_log {
    height: 100vh;
    background-color: #f8f8f8;

    .page_box {

        .search_btn_box {
            position: fixed;
            top: calc(20rpx + var(--status-bar-height));
            right: 30rpx;
            width: 140rpx;
            height: 60rpx;
            z-index: 10000000;

            .search_btn {
                font-size: 24rpx;
                height: 60rpx;
                line-height: 60rpx;
                width: 140rpx;
                text-align: center;
                color: #fff;
                background-image: linear-gradient(#F12026, #F12026);
                border-radius: 30rpx;
            }
        }



        .lis_div {
            height: 100%;

            .lis {
                padding: 1rpx 30rpx;

                .li {
                    width: 100%;
                    background-color: #fff;
                    position: relative;
                    padding: 20rpx 200rpx 20rpx 30rpx;
                    border-radius: 24rpx;
                    margin: 30rpx 0;

                    .txt {
                        line-height: 36rpx;
                        color: #333;
                        font-size: 28rpx;
                        margin-bottom: 6rpx;
                        font-weight: bold;
                    }

                    .time {
                        line-height: 40rpx;
                        color: #999999;
                        font-size: 24rpx;
                        margin-top: 10rpx;
                    }

                    .num {
                        line-height: 40rpx;
                        color: #E02E22;
                        font-size: 28rpx;
                        position: absolute;
                        right: 30rpx;
                        top: 50%;
                        margin-top: -20rpx;
                        font-weight: bold;
                    }

                    .num_add {
                        color: #E02E22;
                    }
                }
            }
        }
    }
}

.pub_wallet {
    height: 100vh;
    background-color: #f8f8f8;

    .page_box {
        .lis_div {
            width: calc(100% - 40rpx);
            margin: 40rpx auto;
            background-color: #fff;
            border-radius: 30rpx;
            padding: 50rpx 40rpx;
            display: flex;
            align-items: center;

            .txt {
                line-height: 40rpx;
                color: #000000;
                font-size: 30rpx;
            }

            .num {
                line-height: 40rpx;
                color: #F8211D;
                font-size: 36rpx;
                font-weight: bold;
                flex: 1;
            }

            .btn {
                width: auto;
                padding: 0 40rpx;
                height: 65rpx;
                line-height: 65rpx;
                font-size: 30rpx;
                font-weight: normal;
                margin: 0 0 0 20rpx;
            }
        }
    }
}


.pub_mine_send {
    background-color: #f8f8f8;

    .page_box {

        .input_div {
            width: calc(100% - 60rpx);
            border-radius: 24rpx;
            margin: 52rpx auto 32rpx auto;

            .title {
                font-size: 28rpx;
                color: #000;
                line-height: 40rpx;
                font-weight: bold;
            }

            .msg {
                font-size: 24rpx;
                color: #F8211D;
                line-height: 34rpx;
                margin-top: 12rpx;
            }

            .inputs {
                width: 100%;

                .input {
                    width: 100%;
                    height: 110rpx;
                    padding: 25rpx 20rpx;
                    background-color: #FFFFFF;
                    border-radius: 16rpx;
                    margin-top: 24rpx;
                    position: relative;

                    input {
                        width: 100%;
                        height: 60rpx;
                        line-height: 60rpx;
                        font-size: 32rpx;
                        color: #333;
                    }
                }
            }

            .pub_btn {
                width: 70%;
            }
        }

        .lis_div {
            width: calc(100% - 60rpx);
            margin: 0 auto;

            .tabs {
                display: flex;
                justify-content: space-around;

                .tab {
                    width: 240rpx;
                    height: 80rpx;
                    line-height: 80rpx;
                    text-align: center;
                    font-size: 32rpx;
                    color: #F8211D;
                    font-weight: bold;
                    background-image: linear-gradient(#fee8e3, #fee8e3);
                    border-top-right-radius: 24rpx;
                    border-top-left-radius: 24rpx;
                }

                .tab_active {
                    color: #fff;
                    background-image: linear-gradient(to right, #F8211D, #F8211D);
                }

            }

            .lis_box {
                background-color: #fff;
                border-radius: 24rpx;
                min-height: 600rpx;
                padding: 20rpx;
            }

            .li_td {
                display: flex;

                .li {
                    width: 20%;
                    position: relative;
                    line-height: 74rpx;
                    text-align: center;
                    font-size: 20rpx;
                    color: #000;
                    border-radius: 12rpx;

                    .pub_btn {
                        width: 90%;
                        height: 44rpx;
                        line-height: 44rpx;
                        font-size: 20rpx;
                        margin: 15rpx auto;
                    }

                    .pub_btn_no {
                        color: #F8211D;
                        background-image: linear-gradient(to right, #fee8e3, #fee8e3);
                    }
                }

                .li_big {
                    width: 40%;
                }
            }

            .li_th {
                background-color: #fee8e3;
                margin-bottom: 10rpx;

                .li {
                    font-size: 24rpx;
                    color: #F8211D;
                    font-weight: bold;
                }

                .li::before {
                    width: 2rpx;
                    height: 34rpx;
                    background-color: #FFFFFF;
                    content: "";
                    position: absolute;
                    left: 0;
                    top: 50%;
                    margin-top: -17rpx;
                }

                .li:first-child::before {
                    height: 0;
                }
            }
        }
    }
}


.pub_bind_account {
    background: #F9F9F9;
    min-height: 100vh;

    .pub_bind_account_box {
        padding: 40rpx 28rpx 0 28rpx;

        .txt {
            .txt_1 {
                line-height: 40rpx;
                color: #0F0F0F;
                font-size: 28rpx;
                margin: 50rpx 0 10rpx 0;
            }

            .txt_2 {
                line-height: 30rpx;
                color: #999999;
                font-size: 24rpx;
            }
        }
    }
}

.pub_withdraw {
    background-color: #f8f8f8;

    .page_box {

        .input_div {
            width: calc(100% - 60rpx);
            border-radius: 24rpx;
            margin: 52rpx auto 32rpx auto;

            .title {
                font-size: 28rpx;
                color: #000;
                line-height: 40rpx;
                font-weight: bold;
            }

            .msg {
                font-size: 24rpx;
                color: #F8211D;
                line-height: 34rpx;
                margin-top: 12rpx;
            }

            .inputs {
                width: 100%;

                .input {
                    width: 100%;
                    height: 110rpx;
                    padding: 25rpx 20rpx;
                    background-color: #FFFFFF;
                    border-radius: 16rpx;
                    margin-top: 24rpx;
                    position: relative;

                    input {
                        width: 100%;
                        height: 60rpx;
                        line-height: 60rpx;
                        font-size: 32rpx;
                        color: #333;
                    }
                }
            }

            .pub_btn {
                width: 70%;
            }
        }

        .lis_div {
            width: calc(100% - 60rpx);
            margin: 0 auto;


            .lis_box {
                background-color: #fff;
                border-radius: 24rpx;
                min-height: 600rpx;
                padding: 20rpx;
            }

            .li_td {
                display: flex;

                .li {
                    width: 25%;
                    position: relative;
                    line-height: 74rpx;
                    text-align: center;
                    font-size: 20rpx;
                    color: #000;
                    border-radius: 12rpx;

                    .pub_btn {
                        width: 90%;
                        height: 44rpx;
                        line-height: 44rpx;
                        font-size: 20rpx;
                        margin: 15rpx auto;
                    }

                    .pub_btn_no {
                        color: #F8211D;
                        background-image: linear-gradient(to right, #fee8e3, #fee8e3);
                    }
                }

                .li_big {
                    width: 50%;
                }
            }

            .li_th {
                background-color: #fee8e3;
                margin-bottom: 10rpx;

                .li {
                    font-size: 24rpx;
                    color: #F8211D;
                    font-weight: bold;
                }

                .li::before {
                    width: 2rpx;
                    height: 34rpx;
                    background-color: #FFFFFF;
                    content: "";
                    position: absolute;
                    left: 0;
                    top: 50%;
                    margin-top: -17rpx;
                }

                .li:first-child::before {
                    height: 0;
                }
            }
        }
    }
}

.pub_wallet_switch {

    .page_box {

        .msg_div {
            padding: 0 40rpx;

            .p_1 {
                color: #333;
                font-size: 28rpx;
                text-align: center;
                padding-bottom: 20rpx;
                position: relative;
            }

            .p_1::before {
                width: 50rpx;
                height: 2rpx;
                background-color: #333;
                position: absolute;
                bottom: 0;
                left: 50%;
                margin-left: -25rpx;
                content: "";
            }

            .p_2 {
                color: #666;
                font-size: 24rpx;
                line-height: 40rpx;
                margin-top: 5rpx;
            }
        }


        .lis_div {
            .title {
                line-height: 60rpx;
                color: #FFFFFF;
                font-size: 32rpx;
                font-weight: bold;
            }

            .li {
                width: 100%;
                background-color: #fff;
                border-radius: 24rpx;
                margin: 30rpx auto;
                padding: 32rpx 150rpx 32rpx 20rpx;
                position: relative;

                .p_1 {
                    line-height: 40rpx;
                    color: #333333;
                    font-size: 28rpx;
                }

                .p_2 {
                    line-height: 40rpx;
                    color: #999999;
                    font-size: 24rpx;
                    margin-top: 10rpx;
                }

                .p_3 {
                    line-height: 50rpx;
                    color: #E02E22;
                    font-size: 44rpx;
                    position: absolute;
                    right: 20rpx;
                    top: 50%;
                    margin-top: -25rpx;
                    font-weight: bold;
                }
            }
        }
    }
}